{include file="public/header" /}
<article class="page-container">
    <form action="" method="post" class="form form-horizontal" id="form-add">
        <div class="row cl" style="width: 100%">
            <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>用户名：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="{$row.user_name|default=''}" placeholder="" id="user_name" name="user_name" maxlength="10">
            </div>
        </div>
        <div class="row cl" style="width: 100%">
            <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>手机号：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="{$row.mobile|default=''}" placeholder="" id="mobile" name="mobile" maxlength="20">
            </div>
        </div>

        <div class="row cl" style="width: 100%">
            <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>收款方式：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <select name="type" class="select" id="paytype">
                    <option value="1" {if isset($row.type) &&$row.type == '1'}selected{/if}>支付宝</option>
                    <option value="2" {if isset($row.type) && $row.type == '2'}selected{/if}>微信</option>
                    <option value="3" {if isset($row.type) && $row.type == '3'}selected{/if}>银行卡</option>
                    <option value="4" {if isset($row.type) && $row.type == '4'}selected{/if}>平台收款</option>
                </select>
            </div>
        </div>
        <div class="row cl" style="width: 100%">
            <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>账号：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="{$row.account|default=''}" placeholder="" id="account" name="account" maxlength="100">
            </div>
        </div>
        <div class="row cl"  id="img_liner">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>收款码：</label>
            <div class="file">
                <span>选择图片</span>
                <input type="file"  datatype="*" nullmsg="商品图片不能为空" onchange="upload();" id="photoFile">
                <input type="hidden" name="img"  id="pic"  value="{$row.img|default=''}" >
            </div>
            <img id="preview_photo" width="200px" height="200px"   src="{$row.img_url}">
        </div>
        <div class="row cl" style="width: 100%" id="bank_name_liner">
            <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>开户行：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="{$row.bank_name|default=''}" placeholder="" id="bank_name" name="bank_name" maxlength="20">
            </div>
        </div>

        <div class="row cl" style="width: 100%"  id="bank_brach_name_liner">
            <label class="form-label col-xs-2 col-sm-2"><span class="c-red">*</span>开户支行：</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="{$row.bank_brach_name|default=''}" placeholder="" id="bank_brach_name" name="bank_brach_name" maxlength="20">
            </div>
        </div>
        </div>

        <div id="div1" style="padding: 20px"></div>

        <div class="row cl" style="width: 100%">
            <div style="width: 100%;text-align: center">
                <input type="hidden" value="{$row.id|default=''}" name="id">
                <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
            </div>
        </div>
    </form>
</article>

{include file="public/footer" /}
<script>
    $("#form-add").validate({
        rules:{
            username:{
                required:true,
                maxlength:50
            },
        },
        onkeyup:false,
        focusCleanup:true,
        success:"valid",
        submitHandler:function(form){
            $(form).ajaxSubmit({
                success:function(data){
                    console.log(data);
                    if(data.status == 'y'){
                        layer.msg("操作成功",{icon:1,time:1000,shade: [0.3, '#000']},function(){
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.location.reload();
                            parent.layer.closeAll(index);
                        });
                    }else{
                        layer.msg(data.info,{icon:2,time:1000,shade: [0.3, '#000']});
                    }
                },
                error:function(error){
                    layer.msg('系统发生了错误',{icon:2,time:3000,shade: [0.5, '#FF0000']});
                }
            });

        }
    });

    $("#paytype").change(function(){
        var type =  $("#paytype").val()
        initUiByPayType(type)
    });

    var initUiByPayType = function(type){
        if (type==3){
            $("#img_liner").hide()
            $("#bank_name_liner").show()
            $("#bank_brach_name_liner").show()
        }else {
            $("#img_liner").show()
            $("#bank_name_liner").hide()
            $("#bank_brach_name_liner").hide()
        }
    }
    initUiByPayType({$row["type"]})


    /***
     *  上传文件
     * @param file 需要上传的文件
     * @param filePath 上传文件到哪个位置。按官方说法就是key
     * cos是对象存储, 没有path路径概念，不过个人认为这个可以当作路径比较好理解
     */
    function upload() {
        if ($("#photoFile").val() == '') {
            layer.msg('请选择上传文件');
        }
        var formData = new FormData();
        formData.append('photo', document.getElementById('photoFile').files[0]);
        $.ajax({
            url:"{:url('/shop/uploadField')}",
            type:"post",
            data: formData,
            contentType: false,
            processData: false,
            success: function(data) {
                if (data.status == 1) {
                    $("#preview_photo").attr('src',data.data['save_name']);
                    $("#pic").val(data.pic);
                    layer.msg(data.msg);
                } else if(data.status == 2) {
                    $("#preview_photo").attr('src',data.data);
                    $("#pic").val(data.pic);
                    layer.msg(data.msg);
                }else{
                    alert(data.msg);

                }
            },
            error:function(data) {
                alert("上传失败")
            }
        });
    }
</script>
